{% set recommendCourseSets = data('RecommendCourseSets',{type:'live',count:5}) %}
<div class="panel panel-default es-live-recommend">
  <div class="panel-heading">
    <a href="{{ path('course_set_explore', {filter: {type: 'live',price: '',currentLevelId: 'all'},orderBy: 'recommendedSeq'}) }} " class="more">
      <i class="es-icon es-icon-morehoriz"></i>
    </a> 
    <h3 class="panel-title">{{'course_set.live.recommend.course'|trans}}</h3>
  </div>
  
  <div class="panel-body">
  	{% for courseSet in recommendCourseSets if courseSet %}
      {% set course = data('PublishedCourseByCourseSet', {courseSetId: courseSet.id}) %}
        {% set courseSet = courseSet|merge({'course' : course}) %}
	    <div class="media">
	      <div class="media-left">
	      	<a href="{{ path('course_show', {id: courseSet.defaultCourseId}) }}" title="{{ courseSet.title }}" target="_blank">
            <img src="{{ filepath(course_set_cover(courseSet, 'small'), 'courseSet.png') }}" class="img-responsive">
          </a>
	        
	      </div>
	      <div class="media-body">
	        <div class="title">
	          <a href="{{ path('course_show', {id: courseSet.defaultCourseId}) }}" class="gray-darker" title="{{ courseSet.title }}" target="_blank">{{ courseSet.title|plain_text(20) }}</a>
	        </div>
	        <div class="metas">
	        	{% include 'course/widgets/price.html.twig' with {shows:'price'} %}
	        </div>
	      </div>
	    </div>
    {% else %}
    	<div class="empty">{{'course_set.live.recommend.course.empty'|trans}}</div>
    {% endfor %}

  </div>
  
</div>